<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>后台 | Login </title>

    <link href="{$Think.const.RESOURCE}css/bootstrap.min.css" rel="stylesheet">
    <link href="{$Think.const.RESOURCE}font-awesome/css/font-awesome.css" rel="stylesheet">

    <link href="{$Think.const.RESOURCE}css/animate.css" rel="stylesheet">
    <link href="{$Think.const.RESOURCE}css/style.css" rel="stylesheet">
    <script type="text/javascript" src="__PUBLIC__/home/js/jquery-3.2.1.min.js"></script>
</head>

<body class="gray-bg">

<div class="loginColumns animated fadeInDown">
    <div class="middle-box text-center lockscreen animated fadeInDown">
        <div>
            <form class="m-t" role="form" method="post" onsubmit="return check()" action="{:U('user/vaerd')}" >
                <input type="hidden" name="uid" value="{$uid}" />
                <div class="form-group">
                    昵称<input type="text" name="name" class="form-control name" placeholder="请输入3-12位字符" required="">
                </div>
                <div class="form-group">
                    手机号码<input type="text" name="tel" class="form-control telphone" placeholder="请输入11位手机号码" required="">

                    <input type="button" id="sendmsg" class="btn btn-primary block full-width" value="获取验证码" />
                </div>

                <div class="form-group">
                    验证码<input type="text" name="yanzhen"  class="form-control yanzhen" placeholder="请输入验证码" required="">
                </div>
                <div class="form-group">
                    密码 <input type="password" name="pd"  class="form-control pd" placeholder="请输入6-16位数字与字母组合" required="">
                </div>
                <button type="submit" class="btn btn-primary block full-width">注册</button>
            </form>
        </div>
    </div>

</div>
<script type="text/javascript">
    function check() {
       // alert(username+"+"+telphone);
        if(username == true && telphone == true){
            return true;
        }
        return false;
    }
    var username = false;
    var telphone =false;

    var InterValobj;//控制时间
    var count = 60;//间隔时间
    var curCount;//当前剩余时间
    var code =""//验证码
    var codelength = 4;//验证码长度

    function SetRemainTime(){
        if(curCount == 0){
            window.clearInterval(InterValobj);
            $("#sendmsg").val("重发验证码");
            $("#sendmsg").removeAttr("disabled");
            code ="";
        }else{
            curCount--;
            $("#sendmsg").val("获取 " +curCount +" 秒");
        }
    }

    $(function () {
        $(".name").change(function () {
            if(this.value.length < 3){
                alert("请输入3-12位字符");
            }else if(this.value.length > 12){
                alert("请输入3-12位字符");
            }else{
                $.ajax({
                    type:"GET",
                    datatype:"json",
                    url:"__ROOT__/user/vaerd/name/"+this.value,
                    success:function (data) {
                        if(data['status'] == 0){
                            username= false;
                            alert(data.message);
                        }else{
                            username = true;

                           // alert("通过验证");
                        }
                    },
                    error:function () {
                        username = false;
                        alert("发错错误");
                    }
                });
            }
        });

        $(".yanzhen").change(function () {
            //alert(code);
            if(this.value == code){
                alert("验证码正确");
            }else{
                alert("验证码错误");
            }
        });

        $(".telphone").change(function () {
            var phone = /^1[34578]\d{9}$/;
            if(this.value.match(phone)==null) {
                telphone = false;
                alert("请输入正确的手机号码");
            }else{
                $.ajax({
                    type:"GET",
                    datatype:"json",
                    url:"__ROOT__/user/checkTel/tel/"+this.value,
                    success:function (data) {
                        if(data['status'] == 0){
                            telphone = false;
                            alert(data.message);
                        }else{
                            telphone = true;
                            //$("#sendmsg").removeAttr("disabled");
                           // $("#sendmsg").removeAttrs("disabled");
                           // alert("通过验证");
                        }

                    },
                    error:function () {
                        telphone = false;
                         alert("发错错误");
                    }
                });
            }
        });

        $("#sendmsg").click(function () {
            //alert(1);
            //$("#sendmsg").val("获取 " +curCount +" 秒");
            if(telphone==true){
                var tel = $(".telphone").val();
                $.ajax({
                    type:"get",
                    datatype:"json",
                    url:"__ROOT__/user/sendmsg/tel/"+tel,
                    success:function (data) {
                        if(data['status'] == 1){
                            curCount = count;
                            //$("#sendmsg").css("background-color","LightSkyBlue");
                            code = data.code;
                            //alert(data.code);
                            $(".yanzhen").val(data.code);
                            $("#sendmsg").attr("disabled","true");
                            $("#sendmsg").val("获取 " +curCount +" 秒");
                            InterValobj = window.setInterval(SetRemainTime,1000);
                            //alert("验证码发送成功");
                        }else{
                            telphone = true;
                            //alert("通过验证");
                        }

                    },
                    error:function () {
                        alert("发错错误");
                    }
                });
            }else{
               // $("#sendmsg").removeAttrs("disabled");
                alert("请输入正确手机号码！")
            }
        });
    });
</script>
</body>

</html>
